<template>
    <div>
        <!-- 订单详情 -->
        <el-button type="primary" style="margin: 20px 0;" @click="returnOver">返回</el-button>
        <el-card shadow="never">
               
            <div class="title">订单信息</div>
            <ul style="height:100px;">
                <li>订单状态:{{orderType(list.fddzt)}}</li>
                <li>订单编号:{{list.cnumber}}</li>
                <li>下单时间:{{list.tdate}}</li>
                <li>订单总额:{{list.fsje}}元</li>
            </ul>
            <div class="title">商品信息</div>   
            <div>
                <div>
                    <div style="margin-bottom: 20px;">商品主图</div>
                    <!-- <img src="../commercial/images/cash.png" alt="" style="width:200px;"> -->
                    <img :src="list.cpic" alt="" style="width:200px;">
                </div>
                <ul style="height:100px;">
                    <li>商品名称:{{list.cproname}}</li>
                    <li>商品编码:{{list.cnumber}}</li>
                    <li>单位:{{list.cdanwei}}</li>
                </ul>

            </div> 
            <div class="title">用户信息</div>  
            <ul style="height:100px;">
                <li>用户名:{{list.cname}}</li>
                <li>手机号:{{list.cmtel}}</li>
                <li>收货地址:{{list.receAddress}}</li>
           </ul> 
           <div class="title">物流信息</div>  
           <ul style="height:100px;">
               <li>物流公司:{{list.logisticsCompanyName}}</li>
               <li>物流编号:{{list.logisticsNumber}}</li>
            </ul> 
            <div>
                退货原因：
                <span v-for="(item,index) in detail" :key="item.index">{{item.remark}}</span>
            </div>
            
        </el-card>
    </div>
</template>
<script>
export default{
    data(){
        return{
            orderId:this.$route.query.cordid,
            list:{},
            detail:[]
        }
    },
    methods: {
        async initData(){
            let { data } = await this.$post({
                      api: '/order/orderDetail',
                      data:{
                        orderId:this.orderId
                      }
            
                    });
                    if (data.code === 0) {
                        this.list = data.data;
                      console.log(this.list,'this.list')
                    } else {
                      this.$message({
                        type: 'error',
                        message: data.msg
                      })
                  }
        },
        //退货详情
        async Returngoods(){
            let { data } = await this.$post({
                      api: '/order/quitDetail',
                      data:{
                        orderId:this.orderId
                      }
            
                    });
                    if (data.code === 0) {
                       this.detail = data.data
                      console.log(data)
                    } else {
                      this.$message({
                        type: 'error',
                        message: data.msg
                      })
                  }
        },
        orderType(n){
                  // console.log('n',n)
                  let type = '';
                  switch (n){
                    case 0:
                    type = '待支付';
                    break;
                    case 1:
                    type = '待出库';
                    break;
                    case 2:
                    type = '配送中';
                    break;
                    case 4:
                    type = '完成';
                    break;
                    case 5:
                    type = '失效';
                    break;
                    case 6:
                    type = '取消';
                    break;
                    case 7:
                    type = '已退款';
                    break;
                    case 10:
                    type = '退货审核';
                    break;
                    case 11:
                    type = '审核通过';
                    break;
                    case 12:
                    type = '驳回申请';
                    break;
                    default:
                   
                  }
                  return type;

                }, 
                returnOver(){
                    this.$router.go(-1)
                }
    },
    mounted () {
        console.log(this.$route.query.cordid)
        this.initData();
        this.Returngoods();
    }
    
}
</script>
<style scoped>
li{
    float: left;
    padding:30px;
}
</style>